{# Log lines as rows (ui_logs): the page renders them, and the Logs
   stream sends each new batch to add. Three cells: the time, the source
   (with ``links``, Overseer > Logs, the service in its own color linking
   to its page; which of its containers only when it has several; the
   container's full name on hover) and the line: its level as a tag when it
   has a tone (info, the normal case, has none), the message (the lead the time cell repeats is left out, a
   copy keeps it), and a JSON line's fields as muted keys and their values;
   the page's search marks its matches (``filter_input``). One line each, cut at the edge: a click opens a
   line and Wrap opens them all (``.log-line`` in input.css), which shows its
   traceback too, highlighted, named by where it broke in the app's own
   code. A warning or worse marks its row's left edge in its tone, and a
   debug line steps back. Each row carries what the page's filters match
   (``data-facet-*``: its level, service, container and application
   service), so they narrow it with no request (app.js). #}
{% from "components/macros/layout.html" import badge, copy_icon, highlighted %}
{% from "pages/overseer/_macros.html" import own_frame %}
{% set _copy = "ml-1.5 align-middle text-aegis-muted hover:text-aegis-text opacity-0 group-hover/cell:opacity-100 focus:opacity-100" %}
{% for row in rows %}
{% set tone = tones.get(row.level) %}
<tr{% if row.ms %} data-at="{{ row.ms }}"{% endif %} data-facet-level="{{ row.level or 'none' }}" data-facet-service="{{ row.page }}" data-facet-container="{{ row.instance }}"{% if row.app_service %} data-facet-app_service="{{ row.app_service }}"{% endif %} class="log-row border-t border-aegis-border/40 hover:bg-aegis-card align-top cursor-pointer{% if tone == 'muted' %} opacity-60{% endif %}"{% if tone %} data-tone="{{ tone }}"{% endif %}>
  <td class="group/cell px-3 py-1 whitespace-nowrap text-aegis-muted font-mono border-l-2 border-l-transparent">{{ row.at }}{{ copy_icon(row.at, _copy) }}</td>
  <td class="group/cell px-3 py-1 whitespace-nowrap truncate" data-service title="{{ row.instance }}">
    <span data-dot class="inline-block w-2 h-2 mr-1.5 rounded-full align-middle" style="background: var(--aegis-chart-{{ row.color + 1 }})"></span>
    {%- if row.app_service %}<span data-app-service class="text-aegis-text">{{ links.get(row.app_service, {}).get("title", row.app_service) if links else row.app_service }}</span>{% if links %}<span class="text-aegis-muted"> · </span>{% endif %}{% endif %}
    {%- if links %}{% set service = links[row.page] %}<a href="{{ service.url }}" {{ hx_replace(service.url, "#overseer-main") }} class="{{ 'text-aegis-muted' if row.app_service else 'text-aegis-text' }} hover:text-aegis-teal">{{ service.title }}</a>{% endif %}
    {%- if row.source %}<span class="text-aegis-muted">{{ " · " if links }}{{ row.source }}</span>{% endif %}
    {{- copy_icon(row.instance, _copy) -}}
  </td>
  <td class="group/cell px-3 py-1 w-full max-w-0 font-mono">
    <div class="log-line">
      {%- if tone %}<span data-level class="mr-2 text-xxs">{{ badge(row.level, tone) }}</span>{% endif -%}
      <span data-message class="text-aegis-text">{{ row.message }}</span>
      {%- for key, value in row.fields %}<span class="ml-2"><span data-field-key class="text-aegis-muted">{{ key }}=</span><span class="text-aegis-text">{{ value }}</span></span>{% endfor -%}
      {%- if row.trace %}<span class="log-trace-hint ml-2 text-xxs text-aegis-muted">traceback</span>{% endif -%}
      {{- copy_icon(row.copy_text, _copy) -}}
    </div>
    {% if row.metadata %}
    <div data-log-metadata class="log-trace mt-1 text-xs text-aegis-muted break-all">
      {% for key, value in row.metadata %}<span class="mr-2"><span data-field-key>{{ key }}=</span><span>{{ value }}</span></span>{% endfor %}
    </div>
    {% endif %}
    {% if row.trace %}
    <div data-log-trace class="log-trace mt-1">
      {% set own = own_frames(row.trace) %}
      <p class="text-xxs text-aegis-muted">Traceback{% if own %} in {{ own_frame(own[0]) }}{% endif %}{{ copy_icon(row.trace, _copy) }}</p>
      <div class="mt-1">{{ highlighted(row.trace, "pytb", wrap=True)|code_frames }}</div>
    </div>
    {% endif %}
  </td>
</tr>
{% endfor %}